<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ include file="/classes/DBHelper.class.jsp"%>
<%@ include file="/classes/CommonHelper.class.jsp"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
	pageContext.setAttribute("basePath", basePath);
%>

<%
	//获取数据
	String zyfw_id = request.getParameter("zyfw_id");
	String sql = "SELECT * FROM APP_ZYFW t WHERE t.zyfw_id = ?";
	Map<String, Object> zyfw = getObject(sql, new Object[]{zyfw_id});
	pageContext.setAttribute("zyfw", zyfw);
%>
<!DOCTYPE html>
<html>
<head>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>志愿服务-后台管理</title>

<%-- <script type='text/javascript' src="${basePath }plugins/jquery/jquery-1.12.2.min.js"></script> --%>
<link rel="stylesheet" href="${basePath }plugins/layui/v1.0.9/css/layui.css" media="all">
<style type="text/css">
.question, .answer {
	overflow: hidden;
	width: 350px;
	display: inline-block;
	text-overflow: ellipsis;
	white-space: nowrap;
}

th {
	background-color: #f2f2f2;
}
</style>
</head>
<body>
	<form class="layui-form" action="zyfw_verify_do.jsp" method="post">
		<table class="layui-table" style="width: 95%; margin: 10px auto;">
			<tr>
				<th width="150">标题</th>
				<td>${zyfw.title }</td>
			</tr>
			<tr>
				<th width="150">姓名</th>
				<td>${zyfw.name }</td>
			</tr>
			<tr>
				<th width="150">手机号码</th>
				<td>${zyfw.phone_num }</td>
			</tr>
			<tr>
				<th>提交时间</th>
				<td>
					<fmt:formatDate value="${zyfw.create_time }" pattern="yyyy-MM-dd HH:mm:ss" />
				</td>
			</tr>
			<c:if test="${!empty zyfw.file1 ||  !empty zyfw.file2 }">
			<tr>
				<th>附件</th>
				<td>
					<c:if test="${!empty zyfw.file1 }">
						<img alt="" src="${basePath }zyfw/upload/${zyfw.file1 }" style="max-width: 400px;">
					</c:if>	
					<c:if test="${!empty zyfw.file2 }">
						<img alt="" src="${basePath }zyfw/upload/${zyfw.file2 }" style="max-width: 400px;">
					</c:if>		
				</td>
			</tr>
			</c:if>
			<tr>
				<th>当前状态</th>
				<td>
					<c:if test="${zyfw.status eq 'A' }">未答复</c:if>
					<c:if test="${zyfw.status eq 'B' }">已回复</c:if>
					<c:if test="${zyfw.status eq 'C' }">未通过</c:if>
				</td>
			</tr>
			<tr>
				<th>回复状态</th>
				<td>
					<input type="radio" name="status" value="B" title="已回复" <c:if test="${zyfw.status ne 'C'}"> checked="checked"</c:if>>
					<input type="radio" name="status" value="C" title="不通过" <c:if test="${zyfw.status eq 'C' }"> checked="checked"</c:if>>
				</td>
			</tr>
			<tr>
				<th>答复内容</th>
				<td>
					<textarea name="reply" lay-verify="reply" placeholder="请输入回复内容" class="layui-textarea">${zyfw.reply }</textarea>
				</td>
			</tr>
			<tr>
				<th>答复时间</th>
				<td>
					<input type="text" name="replyTime" value="<fmt:formatDate value="${zyfw.reply_time }" pattern="yyyy-MM-dd HH:mm:ss"/>" readonly="readonly" autocomplete="off" class="layui-input" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss'})" placeholder="不选默认为提交时间">
				</td>
			</tr>
			<tr>
				<th></th>
				<td>
					<input type="hidden" name="zyfw_id" value="${zyfw.zyfw_id }" />
					<button class="layui-btn" lay-submit="" lay-filter="submitBtn">立即提交</button>
					<button type="reset" class="layui-btn layui-btn-primary">重置</button>
				</td>
			</tr>
		</table>
	</form>
	<script type='text/javascript' src="${basePath }plugins/jquery/jquery-1.12.2.min.js"></script>
	<script type="text/javascript" src="${basePath }plugins/layui/v1.0.9/layui.js"></script>
	<script charset="utf-8" src="${basePath }plugins/97date/4.8/WdatePicker.js"></script>
	<script type='text/javascript'>
		layui.use('form', function() {
			var $ = layui.jquery, form = layui.form();
			//自定义验证规则
			form.verify({
				answer : function(value) {
					if (value.length < 5) {
						return '答复内容不能少于5个字符';
					}
					if (value.length > 2000) {
						return '答复内容不能超过2000个字符';
					}
				}
			});
			//监听提交
			form.on('submit(submitBtn)', function(data) {
				var index = layer.load(0, {
					shade : false
				});
				$.ajax({
					type : "POST",
					url : "zyfw_verify_do.jsp",
					data : data.field,
					dataType : 'json',
					cache : false,//不缓存数据
					success : function(data) {
						layer.close(index);
						if (data.status == '200') {
							parent.$('#is_update').val(true);
							parent.layer.alert(data.msg, {
								icon : 6
							});
							parent.layer.close(p_index);
						} else {
							layer.alert(data.msg, {
								icon : 5
							})
						}
					},
					error : function(XMLHttpRequest, textStatus, errorThrown) {
						layer.close(index);
						layer.alert('连接错误', {
							icon : 5
						})
					}
				});
				return false;
			});
		});
		var p_index = parent.layer.getFrameIndex(window.name);
	</script>
</body>
</html>